import React from "react";
import "./index.less";

interface mybutton {
  // 必须要的约束 一个函数和一个文字信息用来构造这个按钮
  // 点击退出的函数 约束
  onClick?: () => any;
  // 传入一个placeHolder用于显示
  placeHolder?: string;
}

// React.FC<any>是用来约束组件接受的props的
// 偷懒可以直接any就可以
// 这里我要使用一个写好的mybutton接口传进去使用来约束这个组件props接受的类型
const MyButton: React.FC<mybutton> = (props) => {
  // 自定义组件 一个按钮长得像a标签
  return (
    // 传入的onclick方法作为这个按钮点击的方法
    <button className="mybtn" onClick={props.onClick}>
      {/* //props.placeHolder显示在这个按钮上 */}
      {props.placeHolder}
    </button>
  );
};

export default MyButton;
